<%@ page language="java" contentType="text/html; charset=utf-8"%>
<%@ taglib prefix="s" uri="/struts-tags"%>
<%
	String path = request.getContextPath();
	String basePath = request.getScheme() + "://"
			+ request.getServerName() + ":" + request.getServerPort()
			+ path;
%>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
	<head>
		<title>DIY自选配置 - DIY装机大师 - 佳恒科技</title>
		<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
		<meta content="MSHTML 6.00.2900.5921" name="GENERATOR" />
		<link href="<%=basePath%>/style/common.css" type="text/css"
			rel="stylesheet" />
		<link href="<%=basePath%>/style/zxpz.css" type="text/css"
			rel="stylesheet" />
		<link href="<%=basePath%>/style/pagination.css" type="text/css"
			rel="stylesheet" />
		<script type="text/javascript"
			src="<%=basePath%>/script/jquery1.3.2.js"></script>
		<script language="javascript"
			src="<%=basePath%>/script/jquery.pagination.js"
			type="text/javascript"></script>
		<script language="javascript"
			src="<%=basePath%>/script/jquery.form.js" type="text/javascript"></script>
		<script language="javascript" src="<%=basePath%>/script/diy.js"
			type="text/javascript"></script>
		<style>
.saveDiyForm {
	BORDER-RIGHT: blue 2px solid;
	PADDING-RIGHT: 2px;
	BORDER-TOP: blue 2px solid;
	PADDING-LEFT: 2px;
	BACKGROUND: #fff;
	PADDING-BOTTOM: 2px;
	BORDER-LEFT: blue 2px solid;
	PADDING-TOP: 2px;
	BORDER-BOTTOM: blue 2px solid
}

.saveDiyForm td {
	HEIGHT: 20px
}
</style>
		<script type="text/javascript">
			function getProducts(id)
			{
				$("#selector").html("<img alt='Loading...' src='<%=basePath%>/images/loading.gif'></img>内容加载中...");
				$("#sortId").val(id);
				$("#pj_sort_form").ajaxSubmit({success : function(data) {
					$("#selector").html(data);
					//$("html, body").animate({scrollTop:0}, "slow");
				}});
			}
			$(function(){
				$(".pzList:a:eq(0)").addClass("curr");
				/* 分页插件Pagination */
				var _total_num = $("#total").val();
				var _sort_id = $("#sortId").val();
				$("#pagination").pagination(_total_num, {
							items_per_page : 2,
							callback : pageselectCallback
						});
				function pageselectCallback(page_index, jq) {
					$.ajax({
								type : "POST",
								dataType : "html",
								url : "<%=basePath%>/product/sort",
								data : {
									id: _sort_id,
									page_index : page_index,
									maxResult : 2
								},
								success : function(data) {
									$("#selector").html(data);
								}
							});
				}
			})
		</script>
	</head>
	<body>
		<div class="Main">
			<ul class="diyNav">
				<li>
					<a href="http://diy.360buy.com/DIY_Tjpz.aspx"><img alt="推荐配置"
							src="<%=basePath%>/images/diy_tjpz.gif" /> </a>
				</li>
				<li>
					<img alt="自选配置" src="<%=basePath%>/images/diy_zxpz_curr.gif" />
				</li>
				<li>
					<a href="http://diy.360buy.com/diy_zjjl.aspx"><img alt="装机交流"
							src="<%=basePath%>/images/diy_zjjl.gif" /> </a>
				</li>
			</ul>
			<!--[if !ie]>正文左侧开始<![endif]-->
			<div class="left">
				<div class="pzd_t">
					<img height="88" src="<%=basePath%>/images/column_bgt_zjpzd.gif"
						width="426" />
				</div>
				<div class="pzd_c">
					<div class="pzdList_wrap">
						<div class="pzdList_thead">
							<table cellspacing="0" cellpadding="0" width="100%" border="0">
								<tbody>
									<tr>
										<td class="first" width="60">
											配件
										</td>
										<td>
											名称
										</td>
										<td width="66">
											价格
										</td>
										<td width="54">
											数量
										</td>
										<td width="45">
											取消
										</td>
									</tr>
								</tbody>
							</table>
						</div>
						<s:iterator id="s" value="sortList">
							<div class="pzdList_td">
								<table cellspacing="0" cellpadding="0" width="100%" border="0">
									<tbody>
										<tr>
											<td class="first" width="60">
												${s.name }
											</td>
											<td class="align_Left">
												<div class="name">
													<a class="link_1" id="name${s.id }" target="_blank"></a>
												</div>
											</td>
											<td class="price" id="price${s.id }" width="66">
												&nbsp;
											</td>
											<td id="drp${s.id }" width="54">
												&nbsp;
											</td>
											<td width="45">
												<a id="cancel${s.id }" style="DISPLAY: none"
													href="javascript:del(${s.id })">取消</a>
											</td>
										</tr>
									</tbody>
								</table>
							</div>
						</s:iterator>
						<div class="pzdList_td">
							<table cellspacing="0" cellpadding="0" width="100%" border="0">
								<tbody>
									<tr>
										<td class="first" width="60">
											装机服务
										</td>
										<td class="align_Left">
											<div class="name">
												点击左侧选择自提取货装机服务，专人指导不用愁
											</div>
										</td>
										<td class="price" width="66">
											&nbsp;
										</td>
										<td id="drp1009" width="54">
											X
										</td>
										<td width="45">
											<a href="javascript:del(1009)">取消</a>
										</td>
									</tr>
								</tbody>
							</table>
						</div>
						<div class="pzdList_td">
							<table cellspacing="0" cellpadding="0" width="100%" border="0">
								<tbody>
									<tr>
										<td style="BORDER-LEFT-WIDTH: 0px" width="60">
											<a style="COLOR: #3366ff">上门服务</a>
										</td>
										<td class="align_Left">
											<div class="name">
												主城区免费上门
											</div>
										</td>
										<td width="66">
											&nbsp;
										</td>
										<td width="54">
											X
										</td>
										<td width="45">
											&nbsp;
											<a href="http://diy.360buy.com/DiyConfig.aspx#"></a>
										</td>
									</tr>
								</tbody>
							</table>
						</div>
						<div class="collect">
							共
							<strong class="red" id="warenum">0</strong>&nbsp;个配件&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
							<strong class="price" id="wareallprice">总价：￥0</strong>
						</div>
						<div class="operate">
							<input class="button_bcpzd"
								onclick="saveDiyOrder(this,'cur','0')" type="button" />
							&nbsp;&nbsp;&nbsp;
						</div>
					</div>
				</div>
				<div class="pzd_b"></div>
			</div>
			<!--[if !ie]>正文左侧结束<![endif]-->
			<!--[if !ie]>正文右侧开始<![endif]-->
			<div class="right">
				<ul class="pzList">
					<s:iterator id="s" value="sortList">
						<li>
							<a onclick="getProducts(${s.id })" href="javascript:void()">${s.name
								}</a>
						</li>
					</s:iterator>
				</ul>
				<!-- 页面 -->
				<form id="pj_sort_form" action="<%=basePath%>/product/sort"
					method="post">
					<input id="total" type="hidden" value="${total }" />
					<input id="sortId" name="id" type="hidden" value="${id }" />
				</form>
				<div id="selector">
					<img alt="Loading..." src="<%=basePath%>/images/loading.gif"></img>
					内容加载中...
				</div>
				<div id="pagination" class="pagination paging"></div>
			</div>
			<!--[if !ie]>正文右侧结束<![endif]-->
			<div class="clear"></div>
			<div class="tip2">
				<h6>
					<img src="<%=basePath%>/images/diy_icon1.gif" />
					选择佳恒装机服务，组装不再愁！
				</h6>
				配置单选好了，不会组装怎么办？不用急，佳恒装机服务可以帮您把配置单里的散件组装好，并保证运行稳定及兼容性。
				<br />
				自提装机：北京、上海、广州三个总部自提点及各城市自提点均设有专门的diy服务区，提供现场组装服务，其它自提点暂不提供。
				<br />
				<font color="red">上门装机：</font>北京、上海、广州三地用户，可以选择京东上门服务，我们的工程师会亲自上门进行现场安装及指导。
				<a class="link_1" href="http://www.360buy.com/product/148183.html"
					target="_blank">点此购买</a>上门装机服务（此服务需单独购买）。
			</div>
		</div>
		<!--[if !ie]>Help end<![endif]-->
		<!--[if !ie]>底部内容开始<![endif]-->
		<!--[if !ie]>Footer_Nav end<![endif]-->
		<div class="Copyright">
			备案编号：
			<a class="icp"
				href="http://www.hd315.gov.cn/beian/view.asp?bianhao=010202007080200026">渝ICP备10014249号</a>
			<br />
			Copyright &copy; 2009-2012&nbsp;&nbsp;ohimy.com&nbsp;&nbsp;版权所有
			<br />
		</div>
		<!--[if !ie]>Copyright end<![endif]-->
		<!--[if !ie]>Footer_Link end<![endif]-->
		<!--[if !ie]>底部内容结束<![endif]-->
	</body>
</html>
